<template>
	<u-navbar
	:title='title' 
	:titleStyle="{
		color
	}"
	:bgColor="bgColor" 
	:fixed="true" 
	:border='false'
	:leftIcon='leftIcon'
	:leftIconColor='color'
	:rightIconColor='color'
	:style="{
		color
	}"
	:titleWidth='300'
	:autoBack='autoBack'
	class="useNav"
	:safeAreaInsetTop="true"
	:placeholder="true"
	:isLeft='isLeft'
	@leftClick="back"
	>
			<template slot="right"><slot name="right"></slot></template>
	</u-navbar>

</template>

<script>
	// import props from './props.js';
	
	import {setThemeColor} from '@/utils/setTheme.js'
	export default {
		name:"useNavBar",
		// mixins: [ props],
		props:{
			title: {
				type: String,
				default: ''
			},
			color: {
				type: String,
				default: '#fff'
			},
			rightIconColor: {
				type: String,
				default: '#fff'
			},
			autoBack: {
				type: Boolean,
				default: true
			},
			bgColor: {
				type: String,
				default: setThemeColor()
			},
			isLeft: {
				type: Boolean,
				default: true
			},
				// 左边的图标
			leftIcon: {
				type: [String,Boolean],
				default: 'arrow-left'
			},
			
		},
		data() {
			return {
				setThemeColor:setThemeColor(),

			};
		},
		methods:{
			// 点击左侧区域
			back() {
				this.$emit('clickLeft')
			},
		}
	}
</script>

<style lang="scss">



</style>